<template>
    <div class="exper-image-wrapper">
        <span class="label">科研：</span
        ><Select filterable
            v-model="selectResearchId"
            placeholder="请选择科研"
            class="exp-select"
            filterable
            @on-change="querytempByID"
        >
            <Option
                v-for="value in researchList"
                :value="value.id"
                :key="value.tmplId"
                :title="value.name"
                >{{ value.name }}</Option
            >
        </Select>
    </div>
</template>
<script>
import { getShareContent } from '../../api/share.js';
import { getTempInfpByID } from '@/api/proTemplate.js';
export default {
    name: 'ExperTemplate',
    data() {
        return {
            researchList: [],
            selectResearchId: ''
        };
    },
    computed: {},
    mounted() {
        this.getShareContent();
    },
    methods: {
        // 分享给我的科研
        getShareContent() {
            let params = {
                pageIndex: 1,
                pageSize: 100000
                // order: 'desc',
                // sortBy: 'createTime',
            };
            getShareContent(params)
                .then(({ code, data: { items: researchList }, message }) => {
                    if (code == 1) {
                        this.researchList = researchList.filter((item) => item.tmplId);
                    } else {
                    }
                })
                .catch((err) => {});
        },
        querytempByID(key) {
            let content = this.researchList.find((item) => item.id === key);
            getTempInfpByID(content.tmplId)
                .then(({ code, data: { id, name }, message }) => {
                    if (code === 1) {
                        if (!name) {
                            this.$Message.error('没有查询到模板信息,请重新选择');
                            return;
                        }
                        this.$emit('on-select', {
                            id: id,
                            name: name,
                            contentId: key
                        });
                    }
                })
                .catch((err) => {
                    console.log(err);
                });
        }
    }
};
</script>
<style scoped>
.w100 {
    width: 100px;
}
.no-radius {
    border-radius: 0;
}
.exper-image-wrapper {
    display: flex;
}
.exper-image-wrapper .label {
    flex: none;
}
.exper-image-wrapper .exp-select {
    flex: auto;
}
</style>
